<!DOCTYPE html>
<meta charset="UTF-8">
<div th:if="${books.size() == 0}">
	<h2>该类型还没有上架图书哦，敬请期待！</h2>
</div>
<table style="text-align: center; margin-left: 70px;">
	<tr th:each="b:${books}"style="float: left;">
		<td class="td" style="padding-right: 45px;padding-bottom: 25px;">
			<img alt="log" th:src="@{book/download/(id=${b.id})}" width=150px, height=250px ><br><br>
			<label th:text="${b.title}"></label><br>
			<label>数量：</label><label th:text="${b.number}"></label><br>
			<button style="width: 100%" class="btn btn-default" type="button" th:onclick="'javascript:borrow(\''+${b.id}+'\',\''+${b.number}+'\')'">借书</button>
		</td>
			
	</tr>
</table>
<hr style="background: black;">
<style type="text/css">
	
</style>
<script>
	$('.td').mouseover(function(){
		$('.td').attr("border","1");
	})
	
	function borrow(id,number){
		layui.use('layer', function(){
		var layer = layui.layer;
		if(number<=0){
			layer.open({
			  title: '提示信息',
			  content: '数量不足' //这里content是一个普通的String
			});
			return;
		}
		 layer.confirm('借书期限两个月，确定借书吗？', function() {
			  $.post('userbook/jie',{id:id},function(result){
				  layer.msg(result);
				  $('#body1').load('userbook/books');
			  })
		  });
		});   
	}
		
</script>
